<template>
    <Form
        class="declare-form"
        ref="form"
        :model="form"
        :rules="formRules"
        :show-message="false"
        v-blur="blurEvent"
        v-focusJump="{
            onEnter: enterEvent,
            onLast: handleLastEnter
        }"
    >
        <Row>
            <iCol class="form-label" span="8">随附单证代码</iCol>
            <iCol span="16">
                <FormItem
                    prop="docuCode"
                    class="formInput requireBG"
                    :error="tips.docuCode"
                >
                    <RemoteSearch
                        name="docuCode"
                        :disabled="disabled"
                        :notAllowedList="disableDocuCode"
                        :title="tips.docuCode"
                        v-model="form.docuCode"
                        :list="supervisionList"
                        keywordFiled="dataName"
                        valueField="dataCode"
                        :labelFieldList="['dataCode', 'dataName']"
                    ></RemoteSearch>
                </FormItem>
            </iCol>
        </Row>
        <Row>
            <iCol class="form-label" span="8">随附单证编号</iCol>
            <iCol span="16">
                <FormItem
                    prop="certCode"
                    class="formInput requireBG mt-1"
                    :error="tips.certCode"
                >
                    <Input
                        name="certCode"
                        :disabled="disabled"
                        v-model.trim="form.certCode"
                        :title="tips.certCode"
                        @on-blur="handleCertCodeBlur"
                        @on-enter="handleCertCodeEnter"
                    ></Input>
                </FormItem>
            </iCol>
        </Row>
    </Form>
</template>

<script>
import RemoteSearch from '@/view/components/RemoteSearch'
import { formRules, formMethods } from '@/mixins/form/form'
import eventMixin from '@/mixins/form/event'

export default {
    mixins: [
        eventMixin,
        formRules,
        formMethods
    ],
    props: {
        disabled: {
            type: Boolean,
            default: false
        },
        // 随附单证代码选项
        supervisionList: {
            type: Array,
            default: function () {
                return []
            }
        }
    },
    components: {
        RemoteSearch
    },
    data () {
        return {
            disableDocuCode: Object.freeze([
                '1',
                '2',
                '3',
                '4',
                '5',
                'x',
                'y',
                'G'
            ]),
            form: {
                declareId: '', // 报关报检单id,
                declareDocId: '', // 报关单随附单证id,
                certCode: '', // 单证编号,
                docuCode: '', // 随附单证类型Code,
                customsDeclareEdocRealas: []
            },
            tips: {
                docuCode: '',
                certCode: ''
            }
        }
    },
    methods: {
        openGoodsRelation () {
            this.$emit('openGoodsRelation')
        },
        // 随附单证编号回车事件
        handleCertCodeEnter (event) {
            event.stopPropagation() // 阻止默认事件禁止提交
            this.$refs.form.validateField('certCode', err => {
                if (!err) {
                    event.target.blur()
                }
            })
        },
        // 随附单证编号失去光标事件
        handleCertCodeBlur (event) {
            this.$refs.form.validateField('certCode', err => {
                if (!err) {
                    this.handleLastEnter()
                }
            })
        }
    }
}
</script>
